<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>搜索页面</title>
    <!-- 引入清除公共样式表 -->
    <link rel="stylesheet" href="../css/reset.css">
    <!-- 引入公共部分样式表 -->
    <link rel="stylesheet" href="../css/common.css">
    <!-- 引入搜索页面部分样式表 -->
    <link rel="stylesheet" href="../css/search.css">
</head>

<body>
    <!-- 顶部导航部分 -->
    <div id="headerTop" class="clearfix">
        <ul class="headerTopLeftNav fl clearfix">
            <li><a href="./login.html">登录</a></li>
            <li><a href="./login.html">注册</a></li>
            <li><a href="http://quan.lukou.com/#/downLoad">移动端下载</a></li>
            <li><a href="javascript:void()">卖家移动端下载</a></li>
        </ul>
        <ul class="headerTopRightNav fl clearfix">
            <li><a href="./index.html">商城首页</a></li>
            <li><a href="javascript:void()">我的订单</a></li>
            <li><a href="./shoppingCart.html">购物车</a></li>
            <li><a href="javascript:void()">客服中心</a></li>
            <li><a href="javascript:void()">个人中心</a></li>
        </ul>
        <ul class="headerTopUserMessage fr clearfix">
            <!-- 动态渲染用户数据 -->
        </ul>
    </div>

    <!-- 顶部logo搜索部分 -->
    <div id="header" class="container">
        <!-- logo部分 -->
        <div class="logo clearfix">
            <a href="javascript:void()">
                <img class="fl" src="../static/images/logo.png" alt="">
                <div class="rightText fr">
                    <h3>熊猫优选</h3>
                    <span>XIONG MAO YOU XUAN</span>
                </div>
            </a>
        </div>

        <!-- 商品名称及展示部分 -->
        <ul class="proNameNav clearfix">
            <li>女装男装系列</li>
            <li>适配箱包系列</li>
            <li>零食王国系列</li>
            <li>手机数码系列</li>
            <li>家居娱乐系列</li>
        </ul>
        <div class="proNav">
            <!-- 动态渲染商品信息 -->
        </div>

        <!-- 搜索部分 -->
        <div class="search">
            <img src="../static/images/search.png" alt="">
        </div>

        <!-- 搜索展开部分 -->
        <div class="searchPro">
            <input type="text" name="search" placeholder="请输入商品名称">
        </div>
    </div>

    <!-- 搜索页导航菜单部分 -->
    <div id="navMenu">
        <ul class="navMenuItem container clearfix">
            <li class="active">首页</li>
            <li>9块9包邮</li>
            <li>超值大额卷</li>
            <li>降温急救穿搭</li>
        </ul>
    </div>

    <!-- 搜索页标题部分 -->
    <div id="titleBar" class="container">
        <h2>价格：</h2>
        <ul class="titleBarPrice">
            <li>0-10</li>
            <li>10-25</li>
            <li>25-50</li>
            <li>80以上</li>
        </ul>
        <div class="priceInput">
            <input class="low" type="text" value="最低价">
            <span>-</span>
            <input class="high" type="text" value="最高价">
        </div>
        <div class="priceQuan">
            <input type="chckbox">
            <span>有优惠券</span>
        </div>
        <button class="determine">确定</button>
        <button class="empty">清空</button>
    </div>

    <!-- 搜索页综合等文字部分 -->
    <div id="comprehensive" class="container">
        <ul>
            <li class="active">综合</li>
            <li>价格最低</li>
            <li>销量最高</li>
        </ul>
    </div>

    <!-- 商品列表部分 -->
    <div id="goodsList" class="container">
        <!-- 动态渲染商品列表数据 -->
    </div>

    <!-- 查看更多按钮部分 -->
    <button id="viewMore" class="container">查看更多</button>

    <!-- 底部部分 -->
    <div id="flooter">
        <div class="flooterLeft clearfix">
            <img class="fl" src="../static/images/logo.png" alt="">
            <div class="Text fl">
                <h2>熊猫优选</h2>
                <p>年轻人网购首选</p>
                <p>购物领卷更省钱</p>
            </div>
        </div>
        <div class="flooterBottom">
            <img src="http://img1.lukou.com/static/img/activity/policeIcon.png" alt="">
            <span>浙公安网备案 33010602009949号 | ICP备案号:浙ICP备17012864号-1</span>
            <img src="http://img1.lukou.com/static/img/activity/license.png" alt="">
            <span>证照信息</span>
        </div>
        <img src="	http://static.anquan.org/static/outer/image/aqkx_83x30.png?id=quan.lukou.com?t=7" alt="">
    </div>
</body>

</html>
<!-- 引入外部jQuery文件 -->
<script src="../lib/jquery-3.6.0.js"></script>
<!-- 引入js文件 -->
<script src="../js/search.js"></script>